$green = #02a774;
$yellow = #f5a100;
$bc = #e4e4e4;

// 一像素下边框
bottom-border-1px($color)
  position relative
  border none
  &::after
    content ''
    position: absolute
    left: 0
    bottom: 0
    width: 100%
    height: 1px
    background-color: $color
    transform: scaleY(.5)

// 一像素上边框
top-border-1px($color)
  position relative
  border none
  &::before
    content ''
    position: absolute
    left: 0
    top: 0
    width: 100%
    height: 1px
    background-color: $color
    transform: scaleY(.5)

// 根据像素比缩放1px像素边框
@media only screen and (-webkit-min-device-pixel-ratio: 2)
  .border-1px
    &::before
      transform:  scaleY(.5)

@media only screen and (-webkit-min-device-pixel-ratio: 3)
  .border-1px
    &::before
      transform:  scaleY(.3333333)

// 根据像素比来使用 2x图 3x图
bg-image($url)
  background-image: url($url + "@2x.png")
  @media (-webkit-min-device-pixel-ratio: 3), (min-device-pixel-ratio: 3)
    background-image: url($url + "@3x.png")

// 清除浮动
clearFix()
  *zoom 1
  &::after
    content ''
    display block
    clear both